<template>
  <div class="size-18.75rem">
    <div class="text-1.562rem font-600 text-[#333333] text-center mb-1.875rem">
      <p>非物质文化遗产</p>
      <p>注册</p>
    </div>

    <a-form :model="formData" layout="vertical" @submit="handleSubmit">
      <a-form-item field="name" label="账号">
        <a-input v-model="formData.userAccount" placeholder="请输入用户名" />
      </a-form-item>
      <a-form-item field="post" label="密码">
        <a-input type="password" v-model="formData.userPassword" placeholder="请输入密码" />
      </a-form-item>
      <a-form-item field="post" label="确认密码">
        <a-input type="password" v-model="formData.checkPassword" placeholder="请输入密码" />
      </a-form-item>
      <a-form-item>
        <a-button class="w-full" html-type="submit" type="primary">注册</a-button>
      </a-form-item>
      <a-row justify="end">
        <a-link href="/user/login">已有账号，去登陆</a-link>
      </a-row>
    </a-form>
  </div>
</template>

<script setup lang="ts">
//@ts-ignore
import { UserControllerService, type UserRegisterRequest } from '@/servers'
//@ts-ignore
import { ResponseCode } from '@/servers/core/request'
import { Message } from '@arco-design/web-vue'
import { reactive } from 'vue'
import { useRouter } from 'vue-router'

const formData: UserRegisterRequest = reactive({})
const router = useRouter()
const handleSubmit = async (data: any) => {
  const res = await UserControllerService.userRegisterUsingPost(data.values)
  if (res.code == ResponseCode.SUCCESS) {
    Message.success({ content: '注册成功' })
    router.push('/user/login')
  }
}
</script>

<style></style>
